import imgzip from 'imgzip'

// 将 base64 代入img标签，以获得图片元信息
const base64InImage = (imgBase64) => {
   return new Promise((resolve, reject) => {
      let image = new Image();
      let imgSrc = imgBase64;
      image.src = imgSrc;

      image.onload = function () {
         let width = image.width;
         let height = image.height;
         console.info("图片元信息：", "width：" + width + "，height：" + height);
         resolve(image)
      }
   })
}

// 将图片压缩成相同规格(图片宽高比例仍然和原图片相同)，基于canvas，结果：base64 => base64/blob
const imageCompress_canvas = async (imgBase64, options = {
   width: 600,
   height: 600,
   quality: 0.4
}, dataType = 'base64') => {
   const image = await base64InImage(imgBase64)

   // 图片原始尺寸
   var originWidth = image.width;
   var originHeight = image.height;
   // 最大尺寸限制
   var maxWidth = options.width,
      maxHeight = options.height;
   // 目标尺寸
   var targetWidth = originWidth,
      targetHeight = originHeight;
   // 图片尺寸超过800x800的限制
   if (originWidth > maxWidth || originHeight > maxHeight) {
      if (originWidth / originHeight > maxWidth / maxHeight) {
         // 更宽，按照宽度限定尺寸
         targetWidth = maxWidth;
         targetHeight = Math.round(maxWidth * (originHeight / originWidth));
      } else {
         targetHeight = maxHeight;
         targetWidth = Math.round(maxHeight * (originWidth / originHeight));
      }
   }

   return new Promise((resolve, reject) => {

      // 缩放图片需要的canvas
      var canvas = document.createElement('canvas');
      var context = canvas.getContext('2d');

      // canvas对图片进行缩放
      canvas.width = targetWidth;
      canvas.height = targetHeight;
      // 清除画布
      context.clearRect(0, 0, targetWidth, targetHeight);
      // 图片压缩
      context.drawImage(image, 0, 0, targetWidth, targetHeight);

      // 是否转成base64格式
      if (dataType == 'base64') {
         let base = canvas.toDataURL('image/png', options.quality)
         resolve(base)
      } else {
         canvas.toBlob((blob) => {
            resolve(blob)
         }, 'image/png', options.quality);
      }
   }).catch(err => {
      console.log("错误：", err)
   })

}


// 高性能图片压缩插件(其实和上面写的差不多，建议用上面的方法，更灵活)
//options 压缩参数(宽/高/质量) {width:图片高度,height:图片宽高比,quality:0.7}

const imageCompress_imgzip = (file, options = {
   width: 600,
   height: 600,
   quality: 0.4
}, dataType = 'base64') => {
   return new Promise((resolve, reject) => {
      imgzip.photoCompress(file, options, (base64) => {
         //document.getElementById('img').src = base64  //预览图片
         if (dataType == 'base64') {
            resolve(base64)
         } else {
            //转blod流
            let blod = imgzip.convertBase64UrlToBlob(base64);
            resolve(blod)
         }
         // let formData = new FormData();
         // formData.append("file", blod, "file_" + Date.parse(new Date()) + ".jpg"); // 文件对象
         // //上传操作....
      })
   })
}


// 批量图片压缩处理
const imageCompressBatch = async (list) => {
   let l = [];
   let arr = []

   for (let i = 0; i < list.length; i++) {
      // l[i] = list[i];
      arr.push(imageCompress_canvas(list[i]).then(b => {
         l.push(b);
      }));
   }

   return Promise.all(arr).then(() => {
      return l;
   })

}


export {
   base64InImage as getImageMetaInfo,
   imageCompress_canvas as getImageAfterCompressFromCanvas,
   imageCompressBatch as getImageAfterCompressBatch,
   imageCompress_imgzip as getImageAfterCompressFromImgzip
}